<!-- 账户汇总--付款预估收益明细 -->
<template>
  <div>
    <div class="table-page-search">
      <a-form>
        <a-form-item label="订单编号">
          <a-input v-model="queryParam.orderCode" placeholder="请输入订单编号" allowClear />
        </a-form-item>
        <a-form-item label="支付时间">
          <a-range-picker format="YYYY-MM-DD" valueFormat="YYYY-MM-DD" v-model="applyTime" class="width-25" />
        </a-form-item>
        <span class="search-submitButtons">
          <a-button type="primary" @click="$refs.table.refresh(true)">查询</a-button>
          <a-button @click="handleReset">重置</a-button>
        </span>
      </a-form>
    </div>
    <s-table ref="table" size="default" rowKey="id, enabled, title" :columns="columns" :data="loadData"
      :rowSelection="null">

      <!-- 订单金额 -->
      <span slot="totalMoney" slot-scope="text"> {{ formatMoney({ isShowFree: false, money: text }) }} </span>

      <!-- 实付金额 -->
      <span slot="payMoney" slot-scope="text"> {{ formatMoney({ isShowFree: false, money: text }) }} </span>

      <!-- 付款预估收益 -->
      <span slot="income" slot-scope="text" style="color: red;"> {{ formatMoney({ isShowFree: false, money: text }) }}
      </span>

      <!--订单状态-->
      <span slot="orderState" slot-scope="text,row"
        :style="{ color: getActivityOrderStatus(row.orderState, row.payState, row.refundStatus).color }">
        {{ getActivityOrderStatus(row.orderState, row.payState, row.refundStatus).name }}
      </span>



      <!--创建人信息-->
      <div slot="userName" slot-scope="text,row">
        <div>{{ row.userName }}</div>
        <div></div>
      </div>

      <!--支付方式-->
      <span slot="payMode" slot-scope="text">
        {{ payMode(text) }}
      </span>
    </s-table>
  </div>
</template>

<script>
import { STable } from '@/components'
import { ticketIncomeList } from '@/api/finance/finance'
import { orderTypeDict, payModeDict } from '@/api/order/order'
import { orderTypeEnum } from '@/enums/system'
import { formatMoney } from "@/utils/number";
import { getActivityOrderStatus } from '@/utils/orderStatusText'
export default {
  components: {
    STable,
  },
  data() {
    return {
      pagination: {
        current: 1,
        pageSize: 10,
      },
      queryParam: {
        orderCode: undefined, //订单号
        // orderType: undefined, //订单类型
        startTime: undefined, //支付时间开始
        endTime: undefined, //支付时间结束
      },
      columns: [
        {
          title: '订单号',
          dataIndex: 'orderCode',
          width: '220px',
        },
        {
          title: '活动名称',
          dataIndex: 'productName',
          width: '220px',
        },
        {
          title: '类型名称',
          dataIndex: 'specificationName',
          width: '220px',
        },
        {
          title: '报名数',
          dataIndex: 'productCount',
          width: '100px',
        },
        {
          title: '订单金额',
          dataIndex: 'totalMoney',
          ellipsis: true,
          width: '100px',
          scopedSlots: { customRender: 'totalMoney' },
        },
        {
          title: '实付金额',
          dataIndex: 'payMoney',
          ellipsis: true,
          width: '100px',
          scopedSlots: { customRender: 'payMoney' },
        },
        {
          title: '预估收益',
          dataIndex: 'income',
          ellipsis: true,
          width: '180px',
          scopedSlots: { customRender: 'income' },
        },
        {
          title: '订单状态',
          dataIndex: 'orderState',
          ellipsis: true,
          width: '120px',
          scopedSlots: { customRender: 'orderState' },
        },

        {
          title: '创建人信息',
          dataIndex: 'userName',
          ellipsis: true,
          width: '100px',
          scopedSlots: { customRender: 'userName' },
        },
        {
          title: '支付方式',
          dataIndex: 'payMode',
          ellipsis: true,
          width: '120px',
          scopedSlots: { customRender: 'payMode' },
        },
        {
          title: '提交时间',
          dataIndex: 'createTime',
          ellipsis: true,
          width: '120px',
        },

        {
          title: '支付时间',
          dataIndex: 'payTime',
          ellipsis: true,
          width: '150px',
        },
        {
          title: '订单来源',
          dataIndex: 'sourceOrgName',
          ellipsis: true,
          width: '120px',
        },
        {
          title: '订单归属',
          ellipsis: true,
          width: '120px',
          dataIndex: 'orgName',
        },


      ],
      pageNum: 1,
      // 加载数据方法 必须为 Promise 对象
      loadData: async (parameter) => {
        var params = {
          current: parameter.pageNum,
          size: parameter.pageSize,
        }
        return ticketIncomeList(Object.assign(params, this.queryParam))
          .then((res) => {
            if (res.code === 0) {
              this.pagination.current = parameter.pageNum
              this.pagination.pageSize = parameter.pageSize
              return res
            } else {
              this.$message.error(res.msg)
            }
          })
          .catch((err) => {
            this.$message.error(err.msg)
          })
      },
      orderTypeDict,
      orderTypeEnum,
    }
  },
  computed: {
    applyTime: {
      get() {
        return [this.queryParam.startTime, this.queryParam.endTime]
      },
      set(val) {
        this.queryParam.startTime = val[0]
        this.queryParam.endTime = val[1]
      },
    },

  },
  created() { },
  methods: {
    getActivityOrderStatus,
    formatMoney,
    handleReset() {
      Object.keys(this.queryParam).forEach((k) => {
        this.queryParam[k] = undefined
      })
      this.$refs.table.refresh(true)
    },
    payState(text) {
      const item = this.Dict.getLocal('orderPayStatus').find(item => item.dictValue ==
        text)
      if (item) {
        return item.dictLabel
      }
      return ''
    },
    refundStatus(text) {
      const item = this.Dict.getLocal('RefundStatusEnumDict').find(item => item.dictValue ==
        text)
      if (item) {
        return item.incomeText
      }
      return ''
    },
    payMode(text) {
      const item = payModeDict.find(item => item.value ==
        text)
      if (item) {
        return item.label
      }
      return ''
    }
  },
}
</script>
<style scoped lang="less"></style>
